<template>
	<div>
		<Row :gutter="16">
    		<ICol span="6"><IButton v-if="$store.getters.per.config_sms_tpl_create" type="primary" @click="newTpl()" >添加新模版</IButton></ICol>
    		<ICol span="18">
                <Search :callback="resetTable"  ref="search"></Search>      
            </ICol>
    	</Row>
		<BaseTable :url="table.url" :header="table.header" ref="table" ></BaseTable>
		<Update ref="update" :callback="resetTable"></Update>
	</div>
</template>
<script>
import {Row,Col,Button} from 'view-design';

import BaseTable  from 'admin/components/common/table/base';
import Update  from 'admin/components/config/sms/tpl/update';
import Search from 'admin/components/config/sms/tpl/search';

export default{
	components:{
		Row,
        'ICol':Col,
        BaseTable,
        'IButton':Button,
        Update,
        Search
    },
    data () {
        return {
        	table:{
        		url : '/config/sms/tpl/view/list',
        		header: []
        	},
        	//短信服务商列表
        	config_ids : [],
        	//全局配置短信服务商key名
        	sms_key : 'sms_service',
        	//短信使用模块
        	modules:[
                {name : '注册', value : 'register'},
                {name : '找回密码', value : 'findPwd'},
                {name : '绑定账户', value : 'bindAccount'},
            ],
        }
    },
    methods:{
    	newTpl(){
    		this.$refs['update'].modal = true;
    	},
    	resetTable(params){
            this.$refs['table'].tableData(params);
    	}
    },
    created:function(){
        
        //获取短信服务商
    	this.Axios.Config.Sms.Tpl.GetConfigKey({key:this.sms_key})
        .then(res =>{
            if(!res) return false;
            var data = res.data;
            for(var i in data){
            	this.config_ids.push({id : data[i]['id'], vue : data[i]['vue'] , desc : data[i]['desc']});
            	this.$refs['update'].config_ids.push({id : data[i]['id'],desc : data[i]['desc']});
                this.$refs['search'].config_ids.push({id : data[i]['id'],desc : data[i]['desc']});
            }
        })

    	this.table.header =  [
            {
                title: '模版ID',
                key: 'id',
                width :80,
            },
            {
		        title: '模版内容',
		        key: 'content'
		    },
		    {
		        title: '服务商',
		        key: 'config_id',
                render: (h, params) => {
                    var desc ='';
                    for(var i in this.config_ids){
                        if(this.config_ids[i]['id']==params.row.config_id){
                            desc = this.config_ids[i]['desc'];break;
                        }
                    }
                    return desc;
                }
		    },
		    {
		        title: '服务商模版ID',
		        key: 'serviceId'
		    },
		    {
		        title: '短信模块',
		        key: 'module',
                render: (h, params) => {
                    var name ='';
                    for(var i in this.modules){
                        if(this.modules[i]['value']==params.row.module){
                            name = this.modules[i]['name'];break;
                        }
                    }
                    return name;
                }
		    },
		    {
		        title: '操作',
		        key: 'action',
                width: 150,
                align: 'center',
                render: (h, params) => {
                    return h('div', [
                        !this.$store.getters.per.config_sms_tpl_update ? '' :
                        h(Button, {
                            props: {
                                type: 'primary',
                                size: 'small'
                            },
                            style: {
                                marginRight: '5px'
                            },
                            on: {
                                click: () => {
                                    var update = this.$refs['update'];

                                    this.Axios.Config.Sms.Tpl.Get(params.row.id)
                                    .then(res =>{
                                        if(!res) return false;
                                        var data              = res.data;
                                        update.form.id        = params.row.id;
                                        update.form.content   = data['content'];
                                        update.form.config_id = data['config_id'];
                                        update.form.serviceId = data['serviceId'];
                                        update.form.module    = data['module'];
                                        update.modal          = true;
                                    })
                                }
                            }
                        }, '编辑'),
                        !this.$store.getters.per.config_sms_tpl_delete ? '' :
                        h(Button, {
                            props: {
                                type: 'error',
                                size: 'small'
                            },
                            on: {
                                click: () => {
                                    this.$Modal.confirm({
                                        title: '你确定要删除吗？',
                                        content: '一旦删除无法恢复',
                                        onOk: () => {
                                            this.Axios.Config.Sms.Tpl.Del(params.row.id)
                                            .then(res =>{
                                                if(!res) return false;
                                                this.$refs.table.tableRowDel = true;
                                                this.resetTable();
                                            })
                                        }
                                    });
                                }
                            }
                        }, '删除')
                    ]);
                }
		    }
        ];
    },
    mounted:function(){
        this.$refs['update'].modules = this.modules;
        this.$refs['search'].modules= this.modules;
    }

}
</script>